<template>
	<view>
		<cu-custom :bgColor="'bg-white'" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content"></block>
		</cu-custom>
		<!-- 搜索 -->
	<!-- 	<view class="cu-bar bg-white search" >
			<view class="search-form round">
				<text class="cuIcon-search"></text>
				<input type="text" placeholder="输入关键字" confirm-type="search" @input="searchIcon"></input>
			</view>
		</view> -->
		
		<!-- 微信小店 -->
		<view class="flex justify-between margin">
			<view class="text-bold text-lg">
				<view><span class="text-red">最新</span>案例</view>
				<view class="text-gray text-sm">new case</view>
				</view>
			<view class="text-red text-sm">More+</view>
		</view>
	
		
		<view class="margin">
		<xg-waterfall  :column-count="2" >
		    <xg-waterfall-header>
	
		    </xg-waterfall-header>
		    <xg-waterfall-item v-for="(item,k) in posts" :key="index">
				<view class="bg-white margin-xs radius" @tap="detail" :data-id="item.id">
					<image :src="item.thumb" class="radius" mode="aspectFill" style="width: 400rpx;height: 390rpx;"></image>
					<view class="text-bold text-black padding-tb-sm">
						{{item.title}}
					</view>
					<view class="text-sm">
						<view class='cu-tag text-blue bg-white text-bold' v-for="(item,index) in item.tag" :key="index">#{{item}}</view>
						
					</view>
				</view>
				
		    </xg-waterfall-item>
		    <xg-waterfall-footer>
				
		    </xg-waterfall-footer>
		</xg-waterfall>
		</view>
		
		<!-- 加载 -->
		<view class="cu-load" :class="!isLoad?'loading':'over'"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLoad:false,
				page:1,
				posts:[],
			}
		},
		onLoad() {
			this.getPosts();
		},
		onReachBottom() {
			this.page = this.page + 1;;
			this.getPosts();
		},
		methods: {
			getPosts(){
				const _this = this;
				var page = _this.page;
				_this.$apiResquest({
					url: 'cms/post',
					method: 'GET',
					query:{page}
				}).then(function(res) {
					if(res.data.data.length <=0){
						_this.isLoad = true;
					}
					_this.posts = _this.posts.concat(res.data.data)
					_this.loading = false
				
				})
			},
			detail: function(e) {
				let id = e.currentTarget.dataset.id
				uni.navigateTo({
					url: '../detail/detail?id='+id
				})
			},
		}
	}
</script>

<style>

</style>
